<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="shortcut icon" type="image/png" href="//www.greathiit.com/favicon.ico"/>
    <link rel="stylesheet" th:href="@{/config/mdui/css/mdui.min.css}">
    <title>哈信息作业管理系统控制面板</title>
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
        .mdui-card {
            margin-bottom: 8px;
        }
    </style>
</head>
<body class="mdui-drawer-body-left mdui-appbar-with-toolbar mdui-theme-primary-indigo mdui-theme-accent-pink">
<header th:replace="common :: header"></header>
<nav th:replace="common :: nav"></nav>
<section class="mdui-container">
    <div class="mdui-card">
        <div class="mdui-card-content">
            <p>系统日志级别：</p>
            <span>设置级别：</span>
            <select class="mdui-select mdui-m-r-1" id="root_select"></select>
            <span class="mdui-m-r-1">有效级别：<span id="root"></span></span><br>
            <button onclick="saveRoot()"
                    class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent mdui-m-t-2">保存
            </button>
        </div>
    </div>
    <div class="mdui-card">
        <div class="mdui-card-content">
            <p>项目日志级别：</p>
            <span>设置级别：</span>
            <select class="mdui-select mdui-m-r-1" id="top_select"></select>
            <span class="mdui-m-r-1">有效级别：<span id="top"></span></span><br>
            <button onclick="saveTop()" class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent mdui-m-t-2">
                保存
            </button>
        </div>
    </div>
    <form th:action="@{/config/filePath}" method="post" onsubmit="return onSave('file')" class="mdui-card">
        <div class="mdui-card-content">
            <div class="mdui-textfield mdui-textfield-floating-label">
                <label class="mdui-textfield-label">文件上传目录</label>
                <!--/*@thymesVar id="file_repository_path" type="java.lang.String"*/-->
                <input class="mdui-textfield-input" id="file" name="name" type="text"
                       th:value="${file_repository_path}"/>
                <div class="mdui-textfield-helper" id="fileSpace"></div>
                <div class="mdui-textfield-error">必填</div>
            </div>
            <input class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent" type="submit" value="保存"/>
        </div>
    </form>
    <form th:action="@{/config/tempDir}" method="post" class="mdui-card">
        <div class="mdui-card-content">
            <div class="mdui-textfield mdui-textfield-floating-label">
                <label class="mdui-textfield-label">打包临时目录(留空则使用系统临时目录)</label>
                <!--/*@thymesVar id="temp_dir" type="java.lang.String"*/-->
                <input class="mdui-textfield-input" id="temp_file" name="name" type="text"
                       th:value="${temp_dir}"/>
                <div class="mdui-textfield-helper">
                    <!--/*@thymesVar id="tempDirPath" type="java.lang.String"*/-->
                    <span th:text="${'当前临时目录：'+tempDirPath}"></span>
                    <span id="tempDirFreeSpace"></span>
                </div>
            </div>
            <input class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent" type="submit" value="保存"/>
        </div>
    </form>
    <form th:action="@{/config/casServerUrl}" method="post" onsubmit="return onSave('cas_server_url')"
          class="mdui-card">
        <div class="mdui-card-content">
            <div class="mdui-textfield mdui-textfield-floating-label">
                <label class="mdui-textfield-label">CAS服务器地址</label>
                <!--/*@thymesVar id="cas_server_url" type="java.lang.String"*/-->
                <input class="mdui-textfield-input" id="cas_server_url" name="name" type="url"
                       th:value="${cas_server_url}"/>
                <div class="mdui-textfield-error">必填</div>
            </div>
            <input class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent" type="submit" value="保存"/>
        </div>
    </form>
    <form th:action="@{/config/casLoginUrl}" method="post" onsubmit="return onSave('cas_login_url')" class="mdui-card">
        <div class="mdui-card-content">
            <div class="mdui-textfield mdui-textfield-floating-label">
                <label class="mdui-textfield-label">CAS服务器登陆地址</label>
                <!--/*@thymesVar id="cas_login_url" type="java.lang.String"*/-->
                <input class="mdui-textfield-input" id="cas_login_url" name="name" type="url"
                       th:value="${cas_login_url}"/>
                <div class="mdui-textfield-error">必填</div>
            </div>
            <input class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent" type="submit" value="保存"/>
        </div>
    </form>
    <form th:action="@{/config/casLogoutUrl}" method="post" onsubmit="return onSave('cas_logout_url')"
          class="mdui-card">
        <div class="mdui-card-content">
            <div class="mdui-textfield mdui-textfield-floating-label">
                <label class="mdui-textfield-label">CAS服务器登出地址</label>
                <!--/*@thymesVar id="cas_logout_url" type="java.lang.String"*/-->
                <input class="mdui-textfield-input" id="cas_logout_url" name="name" type="url"
                       th:value="${cas_logout_url}"/>
                <div class="mdui-textfield-error">必填</div>
            </div>
            <input class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent" type="submit" value="保存"/>
        </div>
    </form>
    <form th:action="@{/config/loginSuccessUrl}" method="post" onsubmit="return onSave('login_success_url')"
          class="mdui-card">
        <div class="mdui-card-content">
            <div class="mdui-textfield mdui-textfield-floating-label">
                <label class="mdui-textfield-label">登陆成功后跳转的地址</label>
                <!--/*@thymesVar id="login_success_url" type="java.lang.String"*/-->
                <input class="mdui-textfield-input" id="login_success_url" name="name" type="url"
                       th:value="${login_success_url}"/>
                <div class="mdui-textfield-error">必填</div>
            </div>
            <input class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent" type="submit" value="保存"/>
        </div>
    </form>
    <form th:action="@{/config/localServerUrl}" method="post" onsubmit="return onSave('local_server_url')"
          class="mdui-card">
        <div class="mdui-card-content">
            <div class="mdui-textfield mdui-textfield-floating-label">
                <label class="mdui-textfield-label">本地服务端地址(该项目地址)</label>
                <!--/*@thymesVar id="local_server_url" type="java.lang.String"*/-->
                <input class="mdui-textfield-input" id="local_server_url" name="name" type="url"
                       th:value="${local_server_url}"/>
                <div class="mdui-textfield-error">必填</div>
            </div>
            <input class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent" type="submit" value="保存"/>
        </div>
    </form>
    <form th:action="@{/config/fontDir}" method="post" onsubmit="return onSave('font_dir_url')"
          class="mdui-card">
        <div class="mdui-card-content">
            <div class="mdui-textfield mdui-textfield-floating-label">
                <label class="mdui-textfield-label">字体文件目录(必须设置,否则解析中文乱码)</label>
                <!--/*@thymesVar id="font_dir" type="java.lang.String"*/-->
                <input class="mdui-textfield-input" id="font_dir_url" name="name" type="text"
                       th:value="${font_dir}"/>
                <div class="mdui-textfield-error">必填</div>
            </div>
            <input class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent" type="submit" value="保存"/>
        </div>
    </form>
    <form th:action="@{/config/user}" method="post" class="mdui-card">
        <div class="mdui-card-content">
            <div class="mdui-textfield mdui-textfield-floating-label">
                <label class="mdui-textfield-label">登陆用户名</label>
                <!--/*@thymesVar id="username" type="java.lang.String"*/-->
                <input class="mdui-textfield-input" name="username" type="text"
                       th:value="${username}" required/>
                <div class="mdui-textfield-error">必填</div>
            </div>
            <div class="mdui-textfield mdui-textfield-floating-label">
                <label class="mdui-textfield-label">登陆密码</label>
                <!--/*@thymesVar id="password" type="java.lang.String"*/-->
                <input class="mdui-textfield-input" name="password" type="text"
                       th:value="${password}" required/>
                <div class="mdui-textfield-error">必填</div>
            </div>
            <input class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent" type="submit" value="保存"/>
        </div>
    </form>
    <div class="mdui-dialog" id="dialog">
        <div class="mdui-dialog-title">错误</div>
        <div class="mdui-dialog-content">目录路径不正确,请检查!</div>
        <div class="mdui-dialog-actions">
            <button class="mdui-btn mdui-ripple" mdui-dialog-cancel>确定</button>
        </div>
    </div>
</section>
<script th:src="@{/config/mdui/js/mdui.min.js}"></script>
<script th:inline="javascript">
    'use strict';
    let $$ = mdui.JQ;
    let freeDirSize = [[${freeSpace}]];
    let freeTempDirSize = [[${tempDirFreeSpace}]];

    function checkAllInputHasValue() {
        $$('.mdui-textfield-input').each(function (i, e) {
            checkInputHasValue(e);
        })
    }

    function checkInputHasValue(e) {
        $$(e.parentNode).removeClass('mdui-textfield-invalid');
        if (e.value === '') {
            $$(e.parentNode).addClass('mdui-textfield-invalid');
            return false;
        }
        return true;
    }

    function getFormatFileSize(size) {
        let number = Number(size);
        if (number < 1048576) {
            return (number / 1024).toFixed(2) + ' KB';
        } else if (number < 1073741824) {
            return (number / 1024 / 1024).toFixed(2) + ' MB';
        } else if (number < 1099511627776) {
            return (number / 1024 / 1024 / 1024).toFixed(2) + ' GB';
        } else if (number < 1125899906842624) {
            return (number / 1024 / 1024 / 1024 / 1024).toFixed(2) + ' TB';
        } else {
            return (number / 1024 / 1024 / 1024 / 1024 / 1024).toFixed(2) + ' PB';
        }
    }

    $$(function () {
        checkAllInputHasValue();
        let f = Number(freeDirSize);
        if (f !== -1) {
            f = getFormatFileSize(f);
            $$('#fileSpace').text('剩余空间：' + f);
        } else {
            new mdui.Dialog('#dialog', {history: false}).open();
        }
        $$(document.getElementById('temp_file').parentNode).removeClass('mdui-textfield-invalid');
        $$('#tempDirFreeSpace').text('剩余空间：' + getFormatFileSize(freeTempDirSize));
        $$.ajax({
            method: 'GET',
            url: './config/actuator/loggers',
            success: function (data) {
                let json = JSON.parse(data);
                let levels = json.levels;
                let top = json.loggers.top;
                let root = json.loggers.ROOT;
                $$('#top').text(top.effectiveLevel);
                $$('#root').text(root.effectiveLevel);
                for (let i = 0; i < levels.length; i++) {
                    if (levels[i] === top.configuredLevel) {
                        $$('#top_select').append('<option value="' + levels[i] + '" selected>' + levels[i] + '</option>');
                    } else {
                        $$('#top_select').append('<option value="' + levels[i] + '">' + levels[i] + '</option>');
                    }
                    if (levels[i] === root.configuredLevel) {
                        $$('#root_select').append('<option value="' + levels[i] + '" selected>' + levels[i] + '</option>');
                    } else {
                        $$('#root_select').append('<option value="' + levels[i] + '">' + levels[i] + '</option>');
                    }
                }
            }
        });
    });

    function onSave(e) {
        let file = document.getElementById(e);
        return checkInputHasValue(file);
    }

    function saveRoot() {
        let select = $$('#root_select').val();
        $$.ajax({
            method: 'POST',
            url: './config/actuator/loggers/ROOT',
            contentType: 'application/json',
            processData: false,
            data: '{"configuredLevel": "' + select + '"}',
            success: function (data) {
                window.location.reload();
            }
        });
    }

    function saveTop() {
        let select = $$('#top_select').val();
        $$.ajax({
            method: 'POST',
            url: './config/actuator/loggers/top',
            contentType: 'application/json',
            processData: false,
            data: '{"configuredLevel": "' + select + '"}',
            success: function (data) {
                window.location.reload();
            }
        });
    }
</script>
</body>
</html>
